<!--
 * @Description: 查看
 * @Author: Liu Zhiwang
 * @Date: 2021-06-08 16:18:15
 * @LastEditTime: 2021-06-08 19:29:46
 * @LastEditors: Liu Zhiwang
-->
<template>
  <div>
    <base-dialog
      class="dialog_box dialog-look"
      width="85%"
      :visible.sync="dialogLook.visible"
      :title="dialog.title"
      :loading="dialog.loading"
      :disabled="dialog.disabled"
      :show-default-footer="false"
      @updateData="updateData"
      @open="beforeOpenDialog">
      <el-form
        ref="dataForm"
        :model="dialog.form"
        :rules="dialog.rules"
        :disabled="dialog.disabled"
        label-width="100px">
        <el-row>
          <el-col :span="6">
            <el-form-item label="单位" prop="deptName">
              <el-input v-model="deptName" type="text" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="计划年份" prop="planYear">
              <el-date-picker
                v-model="dialog.form.planYear"
                type="year"
                :disabled="true"
                placeholder="选择年份" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="6C类型" prop="cType">
              <el-select v-model="dialog.form.cType" class="phm-form" clearable placeholder="请选择6C类型" :disabled="true">
                <!--                <el-option-->
                <!--                  v-for="item in deviceType"-->
                <!--                  :key="item.cType"-->
                <!--                  :label="item.cType"-->
                <!--                  :value="item.cType" />-->
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="编制人" prop="preparedBy">
              <el-input v-model="dialog.form.preparedBy" type="text" :disabled="true" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <div style="width: 100%;height:110px;overflow: scroll;">
              <el-table border style="width:100%;top:10px;table-layout:fixed;font-size: 12px;" :data="tableData">
                <el-table-column prop="railType" label="线路类型" align="center" />
                <el-table-column prop="month1" min-width="130px" label="1月" />
                <el-table-column prop="month2" min-width="130px" label="2月" align="center" />
                <el-table-column prop="month3" min-width="130px" label="3月" align="center" />
                <el-table-column prop="month4" min-width="130px" label="4月" align="center" />
                <el-table-column prop="month5" min-width="130px" label="5月" align="center" />
                <el-table-column prop="month6" min-width="130px" label="6月" align="center" />
                <el-table-column prop="month7" min-width="130px" label="7月" align="center" />
                <el-table-column prop="month8" min-width="130px" label="8月" align="center" />
                <el-table-column prop="month9" min-width="130px" label="9月" align="center" />
                <el-table-column prop="month10" min-width="130px" label="10月" align="center" />
                <el-table-column prop="month11" min-width="130px" label="11月" align="center" />
                <el-table-column prop="month12" min-width="130px" label="12月" align="center" />
              </el-table>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <br><br><br>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <div style="height:40px;">
              <span style="font-size: 18px;color:#005CB0;font-weight: bold;">审核信息</span>
              <hr style="border: 2px solid #005CB0;border-radius: 4px">
            </div>
            <div v-if="isChecked" class="dialog_box" style="padding-top: 20px;">
              <el-row>
                <el-col :span="6">
                  <el-form-item label="审核人" prop="checkBy">
                    <el-input v-model="dialog.auditForm.checkBy" type="text" :disabled="true" />
                  </el-form-item>
                </el-col>
                <el-col :span="18" style="padding-left: 50px;">
                  <el-form-item label="审核结果：" prop="auditStatus">
                    <template>
                      <el-radio v-model="dialog.auditForm.auditStatus" :label="3">通过</el-radio>
                      <el-radio v-model="dialog.auditForm.auditStatus" :label="4">不通过</el-radio>
                    </template>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="审核意见：" prop="cType">
                    <el-input
                      v-model="dialog.auditForm.checkAdvice"
                      type="textarea"
                      :autosize="{ minRows: 2, maxRows: 5}"
                      placeholder="请输入内容" />
                  </el-form-item>
                </el-col>
              </el-row>
            </div>
            <div v-if="!isChecked" class="dialog_box" style="padding-top: 20px;">
              <el-row>
                <el-col :span="24" align="center">
                  <span style="size: 12px;font-weight:inherit;">暂未审核</span>
                </el-col>
              </el-row>
            </div>
            <div class="dialog_box" style="padding-top: 20px;">
              <el-row>
                <el-col>
                  <el-steps :active="activeNum" align-center>
                    <el-step v-for="item in audits" :key="item.title" :title="item.title" :description="item.description" />
                  </el-steps>
                </el-col>
              </el-row>
            </div>
          </el-col>
        </el-row>
      </el-form>
      <div align="center" style="padding-top: 20px;">
        <span slot="footer" class="dialog-footer">
          <el-button v-if="!dialog.disabled" size="medium" icon="el-icon-check" style="width: 100px;height: 35px;background-color: #48B94D;color: #FFFFFF;" @click="addAuditData">保存</el-button>
          <el-button size="medium" icon="el-icon-close" style="width: 100px;height: 35px;background-color: #E05252;color: #FFFFFF;" @click="dialogLook.visible = false">关闭</el-button>
        </span>
      </div>
    </base-dialog>
  </div>
</template>
<script>
import { getDeptAll } from '@/api/cms/basic'
import { getDetailByPlanYearId } from '@/api/cms/Inspection-management/Inspection-plan-management/YearlyPlanDetail'
import { getLineList } from '@/api/platform'
import { addOrEditAuditData, getAuditList, getOne } from '@/api/cms/Inspection-management/Inspection-plan-management/YearlyPlanAudit'
import { getUserInfo } from '@/utils/auth'
export default {
  components: {},
  props: {
    dialog: {
      type: Object,
      default() {
        return {}
      }
    },
    dialogLook: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  data() {
    return {
      isChecked: false,
      deptName: '',
      tableData: [],
      lineAll: [],
      audits: [],
      activeNum: 1
    }
  },
  watch: {
    'dialogLook.visible'() {
      if (this.dialogLook.visible) {
        this.getList()
      }
    }
  },
  methods: {
    // 获取下拉数据、字典
    getList() {},
    // 回调方法
    updateData() {
      this.$refs.dataForm.validate((valid) => {
        if (valid) {
          this.dialog.loading = true
          this.$emit('updateData', this.dialog.form)
        }
      })
    },

    // 初始化
    beforeOpenDialog() {
      this.$nextTick(() => {
        // console.log(this.dialog)
        this.$refs.dataForm.clearValidate()
        getDeptAll().then(response => {
          response.data.forEach(item => {
            if (this.dialog.form.preparedDeptId === item.deptId) {
              this.deptName = item.deptName
            }
          })
        })
        // tableData赋值
        this.tableData = []
        const gt_data = {
          railType: '高铁',
          month1: '',
          month2: '',
          month3: '',
          month4: '',
          month5: '',
          month6: '',
          month7: '',
          month8: '',
          month9: '',
          month10: '',
          month11: '',
          month12: ''
        }
        const pt_data = {
          railType: '普铁',
          month1: '',
          month2: '',
          month3: '',
          month4: '',
          month5: '',
          month6: '',
          month7: '',
          month8: '',
          month9: '',
          month10: '',
          month11: '',
          month12: ''
        }
        getLineList().then((response_line) => {
          this.lineAll = response_line.data
          getDetailByPlanYearId({ 'planYearId': this.dialog.form.id }).then((response) => {
            response.data.forEach(item => {
              if (item.railwayType === 'GT') {
                switch (item.month) {
                  case 1 :
                    gt_data.month1 = gt_data.month1 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 2 :
                    gt_data.month2 = gt_data.month2 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 3 :
                    gt_data.month3 = gt_data.month3 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 4 :
                    gt_data.month4 = gt_data.month4 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 5 :
                    gt_data.month5 = gt_data.month5 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 6 :
                    gt_data.month6 = gt_data.month6 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 7 :
                    gt_data.month7 = gt_data.month7 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 8 :
                    gt_data.month8 = gt_data.month8 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 9 :
                    gt_data.month9 = gt_data.month9 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 10 :
                    gt_data.month10 = gt_data.month10 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 11 :
                    gt_data.month11 = gt_data.month11 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 12 :
                    gt_data.month12 = gt_data.month12 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                }
              }
              if (item.railwayType === 'PT') {
                switch (item.month) {
                  case 1 :
                    pt_data.month1 = pt_data.month1 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 2 :
                    pt_data.month2 = pt_data.month2 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 3 :
                    pt_data.month3 = pt_data.month3 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 4 :
                    pt_data.month4 = pt_data.month4 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 5 :
                    pt_data.month5 = pt_data.month5 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 6 :
                    pt_data.month6 = pt_data.month6 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 7 :
                    pt_data.month7 = pt_data.month7 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 8 :
                    pt_data.month8 = pt_data.month8 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 9 :
                    pt_data.month9 = pt_data.month9 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 10 :
                    pt_data.month10 = pt_data.month10 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 11 :
                    pt_data.month11 = pt_data.month11 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                  case 12 :
                    pt_data.month12 = pt_data.month12 + '\n' + item.lineName + 'x' + item.executeNum
                    break // 停止执行，跳出switch
                }
              }
            })
          })
          this.tableData.push(gt_data)
          this.tableData.push(pt_data)
        })
        if (this.dialog.type === 'check') {
          this.isChecked = true
          this.dialog.auditForm.checkBy = getUserInfo().username
        } else {
          this.isChecked = false
          getOne({ planYearId: this.dialog.form.id }).then(response => {
            if (response.data != null) {
              this.isChecked = true
              this.dialog.auditForm.checkAdvice = response.data.checkAdvice
              this.dialog.auditForm.checkBy = response.data.checkBy
              this.dialog.auditForm.auditStatus = response.data.auditStatus
            } else {
              this.isChecked = false
            }
          })
        }
        this.activeNum = 1
        this.audits = []
        getAuditList({ planYearId: this.dialog.form.id }).then(response => {
          response.data.forEach(item => {
            let name = ''
            if (item.auditStatus === 1 || item.auditStatus === 2) {
              name = '编制'
            } else if (item.auditStatus === 3) {
              name = '发布'
            } else if (item.auditStatus === 4) {
              name = '审核不通过'
            }
            this.audits.push({ title: name, description: item.createDatetime })
          })
          this.activeNum = response.data.length
        })
      })
    },
    formatLine(param) {
      let lineName = ''
      this.lineAll.forEach(item => {
        if (param === item.seclineId) {
          lineName = item.seclineName
        }
      })
      return lineName
    },
    addAuditData() {
      const auditData = {
        planYearId: this.dialog.form.id,
        auditStatus: this.dialog.auditForm.auditStatus,
        checkBy: this.dialog.auditForm.checkBy,
        checkAdvice: this.dialog.auditForm.checkAdvice,
        checkDatetime: new Date()
      }
      addOrEditAuditData(auditData).then(response => {
        this.notifiySuccess('提交审核成功')
        this.dialogLook.visible = false
        this.$emit('updateCheckData', auditData)
      })
    }
  }
}
</script>
<style lang="scss">
.dialog-look {
  .el-dialog__body {
    height: calc(80vh - 1px);
    .base-table {
      height: 470px!important;
    }
  }
}
#customers {
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 20px;
}
#customers td, #customers th {
  border: 1px solid #DFE6EC;
  font-size: 16px;
  line-height: 1.5;
  padding: 8px 0;
}
#customers tr td:nth-child(odd){
  width: 120px;
  white-space: nowrap;
  padding-left: 20px;
  padding-right: 26px;
  text-align: right;
  background: #E9F2FC;
}
#customers tr td:nth-child(even){
  padding-left: 20px;
  padding-right: 20px;
}
.dialog_box #customers tr td.file-box {
  width: 100%;
  text-align: left;
  background: #ffffff;
}
#customers .file-content {
  min-height: 187px;
}
.el-table .cell {
  white-space: pre-line;
}
</style>
